<!DOCTYPE html>
<html class="white">

<head lang="en">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0,maximum-scale=1.0, user-scalable=no" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <title>IFPlanner智能理财规划系统会员</title>
    <link rel="stylesheet" href="css/weixinbuy.css" />
    <script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
    <script id="wx" type="text/javascript" _src="http://res.wx.qq.com/open/js/jweixin-1.4.0.js"></script>
    <script src="js/jquery/jquery-1.8.3.min.js"></script>
    <script type="text/javascript" src="http://pv.sohu.com/cityjson?ie=utf-8"></script>
    <script type="text/javascript" src="js/baiduTemplate.js"></script>

    <style>
    body{
        background: #F5F5F5
    }
    .course-top{
        padding: 5px 10px 15px;
    }
    .line-middle{
        background:rgba(245,245,245,1);
        height: 10px;
    }
    .course-down{
        padding: 20px 10px 15px;
        margin-bottom: 80px;
    }
    .description-title{
        font-size:12px;
        font-family:PingFang-SC-Medium;
        font-weight:500;
        color:rgba(51,51,51,1);
        line-height:24px;
        margin-bottom: 10px;
    }

    .member-type{
        width:100%;
        height:88px;
        border:1px solid rgba(226,219,208,1);
        border-radius:5px;
        display: flex;
        justify-content :space-between;
        background: url('images/monren.png');
        background-repeat: no-repeat;
        background-size: 100% 100%;
        padding: 0 12px;
        margin-bottom: 10px;
        margin-top: 5px;
    }
    .now-select-type{
        background: url('images/nowselect.png') !important;
        background-repeat: no-repeat !important;
        background-size: 100%  100% !important;
    }
    .member-type>div:nth-child(1)>div:nth-child(1){
        font-size:15px;
        font-family:PingFang-SC-Medium;
        font-weight:500;
        color:rgba(51,51,51,1);
        line-height:30px;
    }
    .member-type>div:nth-child(1)>div:nth-child(2){
        font-size:11px;
        font-family:PingFang-SC-Medium;
        font-weight:500;
        color:rgba(153,153,153,1);
        line-height:25px;
    }
    .member-type>div:nth-child(2)>div:nth-child(1){
        font-size:15px;
        font-family:PingFang-SC-Medium;
        font-weight:500;
        color:rgba(198,157,99,1);
        line-height:30px;
    }
    .member-type>div:nth-child(2)>div:nth-child(2){
        font-size:9px;
        font-family:PingFang-SC-Medium;
        font-weight:500;
        text-decoration:line-through;
        color:rgba(153,153,153,1);
        line-height:25px;
    }
    .lightspot ,.label{
        display: inline-block;
        padding: 4px 7px;
        font-size:9px;
        font-family:PingFang-SC-Medium;
        font-weight:500;
        color:rgba(255,255,255,1);
    }
    .lightspot {
        background: url('images/lightspot.png') ;
        background-repeat: no-repeat ;
        background-size: 100% 100% ;
    }
    .label {
        background: url('images/label.png') ;
        background-repeat: no-repeat ;
        background-size: 100% 100% ;
    }
    #pay{
        width:80% !important;
        height:40px !important;
        background:rgba(255,148,0,1) !important;
        border-radius:20px !important;  
        position: fixed;
        left: 0;
        right: 0;
        bottom:20px;
        margin: auto
    }
    </style>
</head>

<body>
    <div class="wrap" id="buy">
        <div class="course-top">
            <div>
                 <img src="images/login.png" alt="">
            </div>
        </div>

        <div class="line-middle"></div>

        <div class="course-down">
            <div class="description-title">尊敬的用户，请选择您要购买的会员套餐。</div>
            <div  id="member-list-wrap">
            </div>
        </div>
       
        <div id="pay" style="display:none;" class="btn pay" onclick="wxPayFun()">微信支付</div>
        <div id="payed" style="display:none;" class="btn alread" onclick="window.location.href = 'http://a.app.qq.com/o/simple.jsp?pkgname=com.anyin.app'">已购买，去学习</div>
    </div>
    <script src="js/buy.js"></script>

    <script  id="listMemberInfo" type="text/html">

         <div>
          <!-- 循环语句 for-->
          <%for(var i=0;i<list.length;i++){%>
                <div  class="member-type <%= i=='0'?'now-select-type':''%>"    data-item="<%=list[i].memberId%>"  onclick=selectFunc(this,<%= i %>)>
                    <div>
                        <div><%=list[i].name%>    <%if(list[i].lightspot&&list[i].lightspot!='') { %>  <div class="lightspot"><%=list[i].lightspot%></div> <% } %>   <%if(list[i].label&&list[i].label!='') { %>   <div class="label"><%=list[i].label%></div> <% } %> </div>
                        <div><%=list[i].explain%></div>
                    </div>
                    <div>
                        <div>￥<%=list[i].amount%></div>
                        <!-- <div>￥<%=list[i].originalPrice%></div> -->
                    </div>
                </div> 
           <%}%>
        </div>


    </script>

    <script  type="text/javascript">

        var nowchoose=""
        //使用baidu.template命名空间
        var bt=baidu.template;
        var temData={}
        //微信打开
        // if (!/MicroMessenger/i.test(navigator.userAgent)){
        //     toast('请使用微信打开');
        // }
        var course={};
        course.memberId=''
        var params = {
            userId: sessionStorage.user,
            spbillCreateIp: returnCitySN.cip,
            memberId: course.memberId,
            openid: sessionStorage.code
        };
    
        var option={
            
            // userId:'19e3c505ec5d45fc89e40a83029b60b6'
            userId:sessionStorage.getItem('user')
        }

        requestFun('financial/h5/IFPlanner/listIFPlannerMemberInfoH5', option).then(function(res) {
            if (res.resultCode == "0000") {
                console.log(res.resultData)
                temData={
                    list:res.resultData.listMemberInfo
                }
                course.memberId=res.resultData.listMemberInfo[0].memberId
                params.memberId=res.resultData.listMemberInfo[0].memberId
                //最简使用方法
                var html=bt('listMemberInfo', temData);
                //渲染
                document.getElementById('member-list-wrap').innerHTML=html;
            }
        })

        function selectFunc (it,index){
            nowchoose=index
           console.log(nowchoose)
           params.memberId=$(it).attr("data-item")
           $(it).addClass('now-select-type')
           $(it).siblings().removeClass('now-select-type')
        }
        

        
        $('#pay').show();
        // if (!sessionStorage.sysTimeStamp) {
            requestFun('financial/h5/getSystemTimeStampH5').then(function(data) {
                params.sysTimeStamp = sessionStorage.sysTimeStamp = data.resultData.sysTimeStamp;
            });
        // } else {
        //     params.sysTimeStamp = sessionStorage.sysTimeStamp;
        // }


        //微信支付
        function onBridgeReady(data, orderId) {
            WeixinJSBridge.invoke(
                'getBrandWCPayRequest', {
                    "appId": data.appId, //公众号名称，由商户传入
                    "timeStamp": data.timeStamp, //时间戳，自1970年以来的秒数
                    "nonceStr": data.nonceStr, //随机串
                    "package": data.package,
                    "signType": data.signType, //微信签名方式：
                    "paySign": data.paySign //微信签名
                },
                function(res) {
                    if (res.err_msg == "get_brand_wcpay_request:ok") {
                        //支付成功
                        requestFun('financial/h5/queryOrderQueryWXH5', {
                            out_trade_no: orderId
                        }).then(function(data) {
                            if (data.resultCode == '0000') {
                                //                            if(data.resultData.trade_state == 'SUCCESS')
                                window.location.href = 'download.html';
                            }
                        });
                    }else if(res.err_msg == "get_brand_wcpay_request:cancel"){ 
                        window.location.href = window.location.href
                        // alert("用户取消支付!");  
                    }else{  
                        window.location.href = window.location.href
                        alert("支付失败!");  
                    }  
                     // 使用以上方式判断前端返回,微信团队郑重提示：res.err_msg将在用户支付成功后返回    ok，但并不保证它绝对可靠。
                }
            );
        }

        function wxPayFun() {

            requestFun('financial/h5/getSystemTimeStampH5').then(function(data) {
                params.sysTimeStamp = sessionStorage.sysTimeStamp = data.resultData.sysTimeStamp;

                var payurl=""
                if (nowchoose==0) {
                    payurl="financial/h5/IFPlanner/buyIFPlannerFlagshipWXpayH5"
                }
                if (nowchoose==1) {
                    payurl="financial/h5/IFPlanner/buyIFPlannerWXpayH5"
                }
                if (nowchoose==2) {
                    payurl="financial/h5/IFPlanner/buyIFPlannerInsuranceWXpayH5"
                }
                if (nowchoose==3) {
                    payurl="financial/h5/IFPlanner/buyIFPlannerOnlyWXpayH5"
                }

                requestFun(payurl, params).then(function(data) {
                    if (data.resultCode == '0000') {
                        if (typeof WeixinJSBridge == "undefined") {
                            if (document.addEventListener) {
                                document.addEventListener('WeixinJSBridgeReady', onBridgeReady(data.resultData.orderString, data.resultData.out_trade_no), false);
                            } else if (document.attachEvent) {
                                document.attachEvent('WeixinJSBridgeReady', onBridgeReady(data.resultData.orderString, data.resultData.out_trade_no));
                                document.attachEvent('onWeixinJSBridgeReady', onBridgeReady(data.resultData.orderString, data.resultData.out_trade_no));
                            }
                        } else {
                            onBridgeReady(data.resultData.orderString, data.resultData.out_trade_no);
                        }
                    }
                })

            });           


        }


        function wxShareFun(shareParams, fn) {
            var _this=this
           var weixinScript = document.getElementById('wx');
           weixinScript.setAttribute('src', weixinScript.getAttribute('_src'));

           weixinScript.onload = function() {
               $.ajax({
                   url: "https://appiwin.anjintech.com/wechat/user/getWeiXinShareParameter",
                   data: {
                       url: window.location.href
                       // url: window.location.href.replace('buySuccess','tobuyh5' )
                   },
                   dataType: "json",
                   type: "post",
                   success: function(data) {
                       wx.config({
                           debug: false,
                           appId: data.appId, // 必填，公众号的唯一标识
                           timestamp: data.timestamp, // 必填，生成签名的时间戳
                           nonceStr: data.nonceStr, // 必填，生成签名的随机串
                           signature: data.signature, // 必填，签名，见附录1
                           jsApiList: ['onMenuShareTimeline', 'onMenuShareAppMessage', 'onMenuShareQQ', 'onMenuShareWeibo']
                       });
                       wx.ready(function() {
                         
                           var shareData = {
                               title: shareParams.title,
                               desc: shareParams.desc,
                               link: 'http://appiwin.anjintech.com/ifplannerLandingPage/tobuyh5.html',
                               imgUrl: shareParams.imgUrl,
                               success: function(res) {
                               },
                               cancel: function(res) {
                                   alert('已取消');
                               },
                               fail: function(res) {
                                   alert('失败'+JSON.stringify(res));
                               }
                           };
                           //分享到朋友圈
                           wx.onMenuShareTimeline(shareData);
                           //分享给朋友
                           wx.onMenuShareAppMessage(shareData);
                           wx.onMenuShareWeibo(shareData);
                           wx.onMenuShareQQ(shareData);
                           fn && typeof fn == 'function' && fn();
                       });
                       wx.error(function(res) {
                           //alert('错误'+JSON.stringify(res));
                           //config信息验证失败会执行error函数，如签名过期导致验证失败，具体错误信息可以打开config的debug模式查看，也可以在返回的res参数中查看，对于SPA可以在这里更新签名。

                       });
                   },
                   error: function(data) {
                       console.warn("error!");
                   }
               });
           }
       }

       var shareOption={
                title: '我已开通IFPlanner智能理财规划系统会员，邀你一起体验！',
                desc: '帮助理财师更好地开展理财规划咨询服务',
                link: localUrl + 'ifplannerLandingPage/tobuyh5.html',
                imgUrl: localUrl + 'ifplannerLandingPage/images/icon.png'
            }
            
      wxShareFun(shareOption)

    </script>
</body>

</html>